<a id="top"></a>
<h1>Lifecycle Hooks</h1>
<a href="#hooks">Peek-a-boo: (most) lifecycle hooks</a>
<a href="#spy">Spy: directive with OnInit & OnDestroy</a>
<a href="#onchanges">OnChanges</a>
<a href="#docheck">DoCheck</a>
<a href="#after-view">AfterViewInit & AfterViewChecked</a>
<a href="#after-content">AfterContentInit & AfterContentChecked</a>
<a href="#counter">Counter: OnChanges + Spy directive</a>

<a id="hooks"></a>
<peek-a-boo-parent></peek-a-boo-parent>
<a href="#top">back to top</a>
<hr />

<a id="spy"></a>
<spy-parent></spy-parent>
<a href="#top">back to top</a>
<hr />

<a id="onchanges"></a>
<on-changes-parent></on-changes-parent>
<a href="#top">back to top</a>
<hr />

<a id="docheck"></a>
<do-check-parent></do-check-parent>
<a href="#top">back to top</a>
<hr />

<a id="after-view"></a>
<after-view-parent></after-view-parent>
<a href="#top">back to top</a>
<hr />

<a id="after-content"></a>
<after-content-parent></after-content-parent>
<a href="#top">back to top</a>
<hr />

<a id="counter"></a>
<counter-parent></counter-parent>
<a href="#top">back to top</a>
